<template>
  <div class="delivery-home">
    <h1>配送到家</h1>
    <HomeList :list="list"></HomeList>
    <div class="back-top" @click="backTopClick"></div>
  </div>
</template>

<script>
import "@/mock";
import HomeList from "@/components/homeList";
export default {
  data() {
    return {
      list: {},
    };
  },
  components: {
    HomeList,
  },
  mounted() {
    this.getMockData();
  },
  methods: {
    backTopClick() {
      const mainDom = document.querySelector(".dmall-main");
      mainDom.scrollTop = 0;
      // console.log(this);
    },
    handleAjax() {
      return new Promise((resolve, reject) => {
        // setTimeout(() => {
        let data = this.$http.get("/api/list");
        resolve(data);
        // }, 3000);
      });
    },
    async getMockData() {
      let result = await this.handleAjax();
      console.log("result: ", result.data);
      this.list = result.data;
    },
  },
};
</script>

<style lang="scss">
.delivery-home {
  transition: all 2s;
}
.back-top {
  width: 60px;
  height: 60px;
  background: lightcoral;
  border-radius: 50%;
  position: fixed;
  bottom: 60px;
  right: 15px;
}
</style>